import React, { useState, createContext } from "react";
import Todolist from "./Todolist";

export const TodolistContext = createContext();

console.log(TodolistContext); //返回一个对象，拥有Provider和Consumer属性
const App = () => {
    const [isShow, setIsShow] = useState(true);
    const [list, setList] = useState([1, 2, 3, 4]);
    const upDateList = (val) => {
        setList([val, ...list]); //异步操作
        localStorage.setItem("todolist", JSON.stringify([val, ...list]));
    };

    return (
        // <div className="App">
        <TodolistContext.Provider value={{ list, upDateList }}>
            <Todolist />
            <button onClick={() => setIsShow(!isShow)}>显示/隐藏</button>
        </TodolistContext.Provider>
    );
};

export default App;
